<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: apple
  Date: 2020/6/9
  Time: 16:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录</title>
    <link type="text/css" rel="stylesheet" href="css/login.css" />
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var height=$(document).height();
            $('.main').css('height',height);
        })

        function changeimg() {
            var btn=document.getElementById("btn");
            var img=document.getElementById("img");
            img.src="/webtest/vali?tm" + new Date().getTime();  <!-- 告诉服务端这是一个新的图片 -->
        }

    </script>
</head>

<body>
<form method="post" action="http://localhost:8080/webtest/log" name="form1" id="form1" onsubmit="return checksub()">
    <div class="main">
        <div class="main0">
            <div class="main_left">
                <img src="images/login-image-3.png" class="theimg"/>
                <img src="images/login-image-2.png" class="secimg"/>
                <img src="images/login-image-1.png" class="firimg"/>
            </div>
            <div class="main_right">
                <div class="main_r_up">
                    <img src="images/logo.png" />
                    <div class="pp"></div>
                </div>

                <div class="sub"><p>还没有账号？<a href="zhuce.jsp"><span class="blue">立即注册</span></a></p></div>
                <div class="txt">
                    <span style="letter-spacing:10px;">手机号:</span>
                    <input name="phone" type="text" class="txtphone" placeholder="请输入注册手机号" value="${cookie.get('name').value}"/>
                </div>
                <div class="txt">
                    <span style="letter-spacing:18px;">密码:</span>
                    <input name="pwd" type="password" class="txtphone" placeholder="请输入登录密码" value="${cookie.get('pwd').value}"/>
                </div>

                <div class="txt">
                    <span style=" float:left;letter-spacing:8px;">验证码:</span>
                    <input name="vali" type="text" class="txtyzm" placeholder="请输入页面验证码"/>
                    <img alt="验证码" src="/webtest/vali" id="img"  class="yzmimg"/>
                    <a href="javascript:void(0)" onclick="changeimg()"><span style="color: green">更换图片</span></a>
                </div>

                <div class="xieyi">
                    <input name="check" type="checkbox"
                            <c:if test="${cookie.get('name')!=null}">
                                checked
                            </c:if>
                    />记住我
                    <input type="checkbox" name="autologin"
                    <c:if test="${cookie.get('name')!=null && cookie.get('pwd')!=null && cookie.get('autologin')!=null}">
                           checked
                            <%response.setHeader("Refresh","3;url=http://localhost:8080/webtest/Homework/Qiantai/index.jsp");%>
                    </c:if>
                    >自动登录
<%--                    <a href="password.html"><span class="blue" style=" padding-left:50px; cursor:pointer">忘记密码?</span></a>--%>
                </div>

                <%--                <!--判断条件应该这样写-->--%>
                <%--                <div class="xieyi"><input type="checkbox" name="autologin"--%>
                <%--                    <c:if test="${cookie.get('name')!=null && cookie.get('pwd')!=null && cookie.get('autologin')!=null}">--%>
                <%--                               checked--%>
                <%--                            <%response.setHeader("Refresh","3;url=http://localhost:8080/webtest/code/jspTest/success.jsp");%>--%>
                <%--                    </c:if>--%>
                <%--                >自动登录</div>--%>

                <div class="xiayibu">
                    <input style="width:260px; height:40px; color:#fff; background:green; border: green"
                           type="submit"  value="登录 >"/>
                </div>
            </div>
        </div>
    </div>

    <script>
        function checksub() {


            var name=document.form1.elements[0].value;
            var pwd=document.form1.elements[1].value;
            var vail=document.form1.elements[2].value;

            var flag=true;

            if(name.length==0||pwd.length<6)
                flag=false;

            if(flag==false){
                alert("请确保账号密码输入无误后再登录");
            }

            if(vail.length==0) {
                alert("请输入验证码");
                flag=false;
            }
            else if(vail.length!=4) {
                alert("验证码输入错误");
                flag=false;
            }
            return flag;
        }
    </script>
</form>
</body>
</html>
